<template>
	<view class="container">
		<view class="titie">标题内容:</view>
		<view class="item">
			<input type="text" placeholder="请输入标题内容（2-30字以内）" v-model="tradingTitle" placeholder-style="font-size:28rpx" />
		</view>
		<view class="item">
			<view class="titie">选择交易类型：</view>
			<view class="type">
				<view class="point" :class="{'cgc':tradingType==0}" @click="point(0)">积分</view>
				<view class="point" :class="{'cgc':tradingType==1}" @click="point(1)">CGC</view>
			</view>
		</view>
		<view class="item">
			<view class="titie">请输入交易数量：</view>
			<input type="number" placeholder="请输入" placeholder-style="font-size:28rpx" v-model="tradingNum" @input="inputnum"/>
		</view>
		<view class="item">
			<view class="titie">价格：</view>
			<view class="type">
				<input class="inputtext" type="number" placeholder="请输入" placeholder-style="font-size:28rpx" v-model="tradingMoney"  @input="inputmoney"/>
				<text style="color: #F09238;">￥</text>
			</view>
		</view>
		<view class="cgct">
			<text style="color:#DD001B;font-size:40rpx;">*</text>
			<text v-if="tradingType==1">官方指导价1CGC={{cgcMoney}}元</text>
			<text v-if="tradingType==0">官方指导价1积分={{pointsMoney}}元</text>
		</view>
		<view class="push" @click="submit">确认发布</view>
	</view>
</template>

<script>
	import{fbjy,cgc,bjcgc}from"../../../api/index.js"
	export default{
		data(){
			return{
				tradingTitle:"",//=标题内容&
				tradingNum:"",//=交易数量&
				tradingMoney:"",//=交易金额&
				tradingType:0,//:积分交易,1:cgc交易
				cgcMoney:"",
				pointsMoney:"",
				flag:false,
				id:''
			}
		},
		onLoad(e) {
			if(e.data){
				this.flag=true
				let data=JSON.parse(e.data)
				console.log(data)
				this.id=data.tradingMarketId
				this.tradingTitle=data.tradingTitle
				this.tradingNum=data.tradingNum
				this.tradingMoney=data.tradingMoney
				this.tradingType=data.tradingType
			}
			this.cgc()
		},
		methods:{
			point(e){
				this.tradingType=e
			},
			async cgc(){
				let res=await this.get(cgc)
				this.cgcMoney=res.data.cgcMoney
				this.pointsMoney=res.data.pointsMoney
			},
			async submit(){
				if(this.tradingTitle.trim()==''){
					this.msg("标题未填写","none")
					return
				}
				if(this.tradingNum==NaN||this.tradingNum==''){
					this.msg("交易数量未填写","none")
					return
				}
				if(this.tradingMoney==''){
					this.msg("交易金额未填写","none")
					return
				}
				uni.showLoading({
					mask:true,
					title:"发布中..."
				})
				let url=fbjy
				let data={
					tradingTitle:this.tradingTitle,
					tradingNum:this.tradingNum,
					tradingMoney:this.tradingMoney,
					tradingType:this.tradingType
				}
				if(this.flag){
					data.tradingMarketId=this.id
					url=bjcgc
				}
				let res=await this.post(url,data)
				this.msg('发布成功')
				setTimeout(()=>{
					uni.navigateBack({
						delta:1
					})
				},1000)
			},
			inputnum(e){
				let data = e.detail.value
				data= data.replace(/[^\d.]/g, ""); //清除“数字”和“.”以外的字符   
				data= data.replace(/\.{2,}/g, "."); //只保留第一个. 清除多余的   
				data= data.replace(".", "$#$").replace(/\./g, "").replace("$#$", ".");
				data= data.replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3'); //只能输入两个小数   
				if (data.indexOf(".") < 0 && data != "") { //以上已经过滤，此处控制的是如果没有小数点，首位不能为类似于 01、02的金额  
					data = parseFloat(data);
				}
				setTimeout(() => {
					data=parseInt(data)
					if(isNaN(data)){
						data=''
					}
					this.tradingNum =data;
					console.log(this.tradingNum)
				},10)
			},
			inputmoney(e){
				let data = e.detail.value
				data= data.replace(/[^\d.]/g, ""); //清除“数字”和“.”以外的字符   
				data= data.replace(/\.{2,}/g, "."); //只保留第一个. 清除多余的   
				data= data.replace(".", "$#$").replace(/\./g, "").replace("$#$", ".");
				data= data.replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3'); //只能输入两个小数   
				if (data.indexOf(".") < 0 && data != "") { //以上已经过滤，此处控制的是如果没有小数点，首位不能为类似于 01、02的金额  
					data = parseFloat(data);
				}
				setTimeout(() => {
					// data=parseInt(data)
					this.tradingMoney =data;
					console.log(this.tradingMoney)
				},10)
			},
			
		}
	}
</script>

<style lang="less">
	.cgct{
		font-size: 26rpx;
		line-height: 30px;
		color: #999999;
		opacity: 1;
		display: flex;
		align-items: center;
	}
	.container{
		padding: 30rpx;
	}
	.titie{
		font-size: 30rpx;
		font-weight: bold;
		color: #333333;
	}
	.item{
		width: 690rpx;
		height: 100rpx;
		border-bottom: 1px solid #DFDFDF;
		display: flex;
		align-items: center;
		justify-content: space-between;
		input{
			width: 440rpx;
		}
	}
	.type{
		display: flex;
		align-items: center;
		width: 190rpx;
		justify-content: space-between;
	}
	.point{
		width: 80rpx;
		height: 50rpx;
		border: 1px solid #999999;
		border-radius: 8rpx;
		text-align: center;
		line-height: 50rpx;
		font-size: 24rpx;
		font-weight: bold;
		color: #333333;
	}
	.cgc{
		width: 80rpx;
		height: 50rpx;
		background: #F09238;
		text-align: center;
		line-height: 50rpx;
		border-radius: 8rpx;
		font-size: 24rpx;
		font-weight: bold;
		color: #FFFFFF;
		border: none;
	}
	.inputtext{
		text-align: right;
	}
	.push{
		width: 690rpx;
		height: 70rpx;
		background: linear-gradient(180deg, #F09238 0%, #EC5F2A 100%);
		border-radius: 35rpx;
		margin-top: 150rpx;
		font-size: 28rpx;
		color: #FFFFFF;
		line-height: 70rpx;
		text-align: center;
	}
</style>
